/**
 * 
 * @author Vanch
 * 
 */
;(function() {
	window.horizontal_bar = function(container_id) {
		this.container_id = container_id;
		this.chartBar = null;
	}
	
	//柱状图初始化操作
	//styleType："yellow",黄色风格；"purple",紫色风格。
	horizontal_bar.prototype.init = function(styleType, peroidType) {
		var self = this;
		self.styleType=styleType;
				
		//柱的颜色列表
		var colorList=['#ac2d62'];

		//默认数据
		var dataLabels=['','','','','','','','','',''];
		//var dataLabels=['10.葫芦岛','9.营口   ','8.本溪   ','7.阜新   ','6.丹东   ','5.铁岭   ','4.鞍山   ','3.锦州   ','2.大连   ','1.沈阳   '];
		var dataValues=[0, 0, 0, 0, 0, 0, 0, 0, 0, 0];
		
		//饼图的周期
		peroidType = '周';
		var titleText = '当前'+peroidType+'销售前10名地区';
		
		var domBar = document.getElementById(self.container_id);
		var chartBar = echarts.init(domBar);
		self.chartBar = chartBar;
		
		self.zoom=(self.chartBar.getWidth()+self.chartBar.getHeight())/660;
		
		//判断颜色风格
		if (self.styleType != "purple"){
			colorList = ['#f7921e'];
		}
		
		//柱状图参数设置
		optionBar = {
			backgroundColor:'transparent',
		    title: {
				show: false,
		        text: titleText,
				subtext: '   ',
				textStyle:{
					color:'#fff',
					fontSize:'14',
				},
				left: 'right',
				padding:[4,4,4,4]
		    },
			
			//禁用提示，否则在手机上会有干扰
		    tooltip: {
				show:false,
		        trigger: 'axis',
		        axisPointer: {
		            type: 'shadow'
		        }
		    },
		    legend: {
		        show: false
		    },
		    grid: {
				top: '1%',
		        left: '9%',
		        right: '4%',
		        bottom: '3%',
		        containLabel: true
		    },
			//X轴配置
		    xAxis: {
		        type: 'value',
				min: 0,
		        boundaryGap: [0, 0.01],
				splitLine: {
		            show: true,
		            lineStyle: {
		                color: '#FBFCFE',
		                type: 'dashed',
						width: 1*self.zoom,
		            }
		        },
				axisLabel: {
						formatter: function (value, index) {
							return ""+value;
						},
		                textStyle: {
		                    color: '#FFFDFF',
							fontSize: 12*self.zoom
		                }
		            },
				axisLine: {
		                lineStyle: {
		                    color: '#FFFDFF',
							type: 'solid',
							width: 1*self.zoom,
		                }
		            }
		    },
			//Y轴配置
		    yAxis: {
		        type: 'category',
		        data: dataLabels,
				axisLabel: {
		                textStyle: {
		                    color: '#FBFFFE',
							fontSize: 14*self.zoom
		                }
		            },
				axisLine: {
		                lineStyle: {
		                    color: '#FFFFFF',
							type: 'solid',
							width: 1*self.zoom,
		                }
		            }
		    },
			//设置柱状图数据
		    series: [
		        {
		            type: 'bar',
					barWidth: '64.3%',
		            data: dataValues,
					itemStyle:{
						normal:{
							color:colorList[0]
						}
					}
		        }
		    ]
		};
		
		//更新柱状图
		if (optionBar && typeof optionBar === "object") {
		    chartBar.setOption(optionBar, true);
		}
	};
	
	//柱状图刷新操作
	horizontal_bar.prototype.refresh = function(labels, values){
		var self = this;

		var dataLabels=['','','','','','','','','',''];
		//var dataLabels=['10.葫芦岛','9.营口   ','8.本溪   ','7.阜新   ','6.丹东   ','5.铁岭   ','4.鞍山   ','3.锦州   ','2.大连   ','1.沈阳   '];
		var dataValues=[0,0,0,0,0,0,0,0,0,0];		
		if(values && values.length && values.length>0){
			//console.log("----------");
			var i=0;
			var j=9;
			//console.log(i+","+j);
			for(;i<values.length;i++){
				//过滤负值
				if(values[i]>=0){
					dataValues[j]=values[i];
					dataLabels[j]=labels[i];
					j--;
				}
			}
		}
		
		//柱的颜色列表
		var colorList=['#ac2d62'];

		//判断颜色风格
		if (self.styleType != "purple"){
			colorList = ['#f7921e'];
		}
		
		//设置柱状图参数
		var optionBar = {
			yAxis: {
				data: dataLabels,
			},
			series: [{
				data: dataValues,
				itemStyle:{
					normal:{
						color:colorList[0]
					}
				}
			}]
		};
		
		//更新柱状图
		self.chartBar.setOption(optionBar);
	};
})(Zepto);